<template>
	<section class="monthly">
		<!--工具条-->
		<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
			<el-form :inline="true" :model="filters">
				<!-- <el-form-item>
					<el-input v-model="filters.name" placeholder="设备IP"></el-input>
				</el-form-item> -->
				<el-date-picker
			      v-model="screenDate"
			      type="daterange"
      			  range-separator="至"
                  @change = "confirmdate"
			      placeholder="请选择开始和结束时间">
			    </el-date-picker>
				<el-form-item>
					<el-button type="primary" @click="screenEdit">筛选</el-button>
				</el-form-item>
				 <el-form-item>
					<el-button :type="(is_disburden && (empty_type == '0')) ? 'primary' : ''" @click="disburdenHander">装货</el-button>
				</el-form-item>
				 <el-form-item>
					<el-button :type="(is_shipment && (empty_type == '1')) ? 'primary' : ''" @click="shipmentHander">卸货</el-button>
				</el-form-item>
				 <el-form-item>
					<el-button :type="(is_access && (empty_type == '2')) ? 'primary' : ''" @click="accessHander">出入记录</el-button>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" v-if="is_access && (empty_type == '2')" v-show="my_permi.indexOf('Summary.export') > -1 || my_permi.indexOf('admin') > -1" @click="exportT('churu')">导出</el-button>
					<el-button type="primary" v-else v-show="my_permi.indexOf('Summary.export') > -1 || my_permi.indexOf('admin') > -1" @click="exportT('other')">导出</el-button>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" v-show="is_shipment && (empty_type == '1')" @click="showPrint('xiehuo')">打印设置</el-button>
					<el-button type="primary" v-show="is_disburden && (empty_type == '0')"  @click="showPrint('zhuanghuo')">打印设置</el-button>
				</el-form-item>
			</el-form>
		</el-col>
		<!--列表-->
		<!-- 装货shipment -->
		<el-table :data="shipmentList" v-show="(is_disburden && (empty_type == '0'))" highlight-current-row v-loading="listLoading" style="width: 100%;" :row-class-name="tableRowClassName" :height="clientHeight" >
			<el-table-column prop="vehicle_number" label="车牌号" width="80">
			</el-table-column>
			<el-table-column prop="tare" label="皮重" width="60">
			</el-table-column>
			<el-table-column prop="is_void_desc" label="是否空车过磅"  width="90">
			</el-table-column>
			<!-- <el-table-column prop="empty_type_desc" label="过磅类型" width="60">
			</el-table-column> -->
			<el-table-column prop="empty_weight_time" label="空车过磅时间" width="90">
			</el-table-column>
			<el-table-column prop="empty_weight" label="空车过磅重量" width="90">
			</el-table-column>
			<el-table-column prop="pick_weight" label="提货重量" width="60">
			</el-table-column>
			<el-table-column prop="net_weight" label="地磅净重" width="60">
			</el-table-column>
			<el-table-column prop="weight_error" label="误差重量" width="60">
			</el-table-column>
			<el-table-column prop="weight_error_ratio" label="误差比例" width="60">
			</el-table-column>
			<el-table-column prop="is_success_desc" label="出厂过磅是否成功" width="110">
			</el-table-column>
			<el-table-column prop="second_time" label="出门时间" width="80">
			</el-table-column>
			<el-table-column prop="is_finished_desc" label="是否完成" width="60">
			</el-table-column>
			<el-table-column label="是否允许出门" prop="is_go_desc" width="110">
				<!-- <template slot-scope="scope"> -->
					<!-- <span v-if="scope.row.is_finished == 'Y' && scope.row.is_go_desc == ''">系统允许出门</span>
					<span v-else-if="scope.row.is_finished == 'N' && scope.row.is_go_desc != ''">人工允许出门</span>
					<span v-else>不允许出门</span> -->
				<!-- </template> -->
			</el-table-column>
			<el-table-column prop="exception" label="异常备案">
			</el-table-column>
			<el-table-column label="操作">
				<template slot-scope="scope">
					<el-button size="small" type="primary" @click="showPrint('', scope.$index, scope.row)">打印</el-button>
				</template>
			</el-table-column>
		</el-table>
		<!-- 卸货disburden -->
		<el-table :data="disburdenList" v-show="(is_shipment && (empty_type == '1'))" highlight-current-row v-loading="listLoading" style="width: 100%;" :height="clientHeight" >
			<el-table-column prop="vehicle_number" label="车牌号" width="100">
			</el-table-column>
			<el-table-column prop="tare" label="皮重" width="60">
			</el-table-column>
			<el-table-column prop="first_readic_datetime" label="刷卡时间" width="80">
			</el-table-column>
			<el-table-column prop="first_weight" label="地磅总重" width="60">
			</el-table-column>
			<el-table-column prop="discharge_weight" label="卸货重量" width="60">
			</el-table-column>
			<el-table-column prop="is_void_desc" label="是否空车过磅" width="90">
			</el-table-column>
			<el-table-column prop="empty_weight_time" label="空车过磅时间" width="90">
			</el-table-column>
			<el-table-column prop="empty_weight" label="空车过磅重量" width="120">
			</el-table-column>
			<el-table-column prop="net_weight" label="地磅净重" width="60">
			</el-table-column>
			<el-table-column prop="weight_error" label="误差重量（地磅）" width="140">
			</el-table-column>
			<el-table-column prop='exception' label="异常备案">
			</el-table-column>
			<el-table-column label="操作" width="100">
				<template slot-scope="scope">
					<el-button size="small" type="primary" @click="showPrint('', scope.$index, scope.row)">打印</el-button>
				</template>
			</el-table-column>
		</el-table>
		<!-- 出入记录recordsList -->
		<el-table :data="accessList" v-show="(is_access && (empty_type == '2'))" highlight-current-row v-loading="listLoading" style="width: 100%;" :row-class-name="tableRowClassName" :height="clientHeight" >
			<el-table-column prop="vehicle_number" label="车牌号">
			</el-table-column>
			<el-table-column prop="tare" label="车辆皮重(KG)">
			</el-table-column>
			<el-table-column prop="driver_name" label="司机姓名">
			</el-table-column>
			<el-table-column prop="readic_datetime" label="刷卡时间">
			</el-table-column>
			<el-table-column prop="net_weight" label="地磅净重">
			</el-table-column>
			<el-table-column label="过磅信息">
				<template slot-scope="scope">
					<el-button size="small" type="primary" @click="viewDetails(scope.$index)">查看</el-button>
				</template>
			</el-table-column>
			<el-table-column prop="io_status_desc" label="出入类型">
			</el-table-column>
			<el-table-column prop="is_finished_desc" label="是否完成">
			</el-table-column>
		</el-table>

		<!--工具条-->
		<el-col :span="24" class="toolbar">
			<el-pagination
				layout="prev, pager, next"
				@current-change="handleCurrentChange"
				:total="total"
				style="float:right;">
			</el-pagination>
		</el-col>

        <!-- 筛选界面 -->
        <el-dialog title="筛选" v-model="screenFormVisible" :close-on-click-modal="false">
            <el-form :model="screenForm" label-width="110px" ref="screenForm">
                <el-form-item v-show="empty_type!='2'" label="是否可以出门">
                	<span class="change-val" @click="changeval('is_go', '1')">
                		<span class="change-val-span" v-if="screenForm.is_go == '0' || screenForm.is_go == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
                		允许出门
                	</span>
                	<span class="change-val" @click="changeval('is_go', '0')">
                		<span class="change-val-span" v-if="screenForm.is_go == '1' || screenForm.is_go == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
	                	不允许出门
	                </span>
                </el-form-item>
                <el-form-item v-show="empty_type!='2'" label="出厂过磅是否成功">
                	<span class="change-val" @click="changeval('is_success', 'Y')">
                		<span class="change-val-span" v-if="screenForm.is_success == 'N' || screenForm.is_success == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
                		出厂过磅成功
                	</span>
                	<span class="change-val" @click="changeval('is_success', 'N')">
                		<span class="change-val-span" v-if="screenForm.is_success == 'Y' || screenForm.is_success == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
	                	出厂过磅失败
	                </span>
                </el-form-item>
                <el-form-item v-show="empty_type!='2'" label="是否退货">
                	<span class="change-val" @click="changeval('is_return', '1')">
                		<span class="change-val-span" v-if="screenForm.is_return == '0' || screenForm.is_return == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
                		是
                	</span>
                	<span class="change-val" @click="changeval('is_return', '0')">
                		<span class="change-val-span" v-if="screenForm.is_return == '1' || screenForm.is_return == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
	                	否
	                </span>
                </el-form-item>
                <el-form-item v-show="empty_type!='2'" label="是否空车过磅">
                	<span class="change-val" @click="changeval('is_void', '1')">
                		<span class="change-val-span" v-if="screenForm.is_void == '0' || screenForm.is_void == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
                		是
                	</span>
                	<span class="change-val" @click="changeval('is_void', '0')">
                		<span class="change-val-span" v-if="screenForm.is_void == '1' || screenForm.is_void == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
	                	否
	                </span>
                </el-form-item>
                <el-form-item v-show="empty_type=='2'" label="出入类型">
                	<span class="change-val" @click="changeval('io_status', '0')">
                		<span class="change-val-span" v-if="screenForm.io_status == '0' || screenForm.io_status == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
                		入厂
                	</span>
                	<span class="change-val" @click="changeval('io_status', '1')">
                		<span class="change-val-span" v-if="screenForm.io_status == '1' || screenForm.io_status == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
	                	出厂
	                </span>
                </el-form-item>
                <el-form-item v-show="empty_type=='2'" label="是否完成">
                	<span class="change-val" @click="changeval('is_finished', 'Y')">
                		<span class="change-val-span" v-if="screenForm.is_finished == '0' || screenForm.is_finished == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
                		是
                	</span>
                	<span class="change-val" @click="changeval('is_finished', 'N')">
                		<span class="change-val-span" v-if="screenForm.is_finished == '1' || screenForm.is_finished == ''"></span>
                		<span class="change-val-span change-active" v-else></span>
	                	否
	                </span>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click.native="screenFormVisible = false">取消</el-button>
                <el-button type="primary" @click.native="screenSubmit" :loading="screenLoading">提交</el-button>
            </div>
        </el-dialog>

		<!--查看初称、回称界面-->
		<el-dialog title="初次称重信息" v-model="detailsVisible" :close-on-click-modal="false">
			<div class="weightD"><span>初称刷卡时间：</span> <span>{{details.readic_datetime}}</span></div>
			<div class="weightD"><span>初称车辆抓拍图片：</span> <img :src="details.capvn_path" @click="isZoom(details.capvn_path)"><span class="print-btn" @click="printBtn(details.capvn_path)">打印</span></div>
			<div class="weightD"><span>初称地磅抓拍A：</span> <img :src="details.cap_a_path" @click="isZoom(details.cap_a_path)"><span class="print-btn" @click="printBtn(details.cap_a_path)">打印</span></div>
			<div class="weightD"><span>初称地磅抓拍B：</span> <img :src="details.cap_b_path" @click="isZoom(details.cap_b_path)"><span class="print-btn" @click="printBtn(details.cap_b_path)">打印</span></div>
		</el-dialog>

		<!-- 图片放大 -->
		<el-dialog title="展示图片" v-model="is_zoom_img" class="zoom-img-dialog" :close-on-click-modal="false">
			<img class="zoom_img_id" :src="zoom_img">
		</el-dialog>

		<!--打印界面-->
		<el-dialog title="打印" v-model="printFormVisible" :close-on-click-modal="false">
			<el-form label-width="110px" ref="printForm">
				<el-checkbox-group v-model="checkList"  v-if="(is_shipment && (empty_type == '1'))">
					<el-checkbox v-for="item in checkListArr" :label="item" :key="item">{{item}}</el-checkbox>
				</el-checkbox-group>
				<el-checkbox-group v-model="checkList2"  v-else>
					<el-checkbox v-for="item in checkListArr" :label="item" :key="item">{{item}}</el-checkbox>
				</el-checkbox-group>
			</el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click.native="printFormVisible = false">取消</el-button>
                <el-button type="primary" @click.native="printSubmit" :loading="printLoading">提交</el-button>
            </div>
		</el-dialog>
	</section>
</template>

<script>
	import { summary, BASEURL, printConfig, printConfigPost } from '@/api/api';
    import { mapState } from 'vuex'
	export default {
		data() {
			return {
				filters: {
					name: ''
				},
				cardList: [],
				total: 0,
				page: 1,
				listLoading: false,
                screenFormVisible: false,//新增界面是否显示
                screenLoading: false,
                //新增界面数据
                screenDate: '',
                screenForm: {
                	is_go: '',
                	is_success: '',
                	is_return: '',
                	is_void: '',
                	io_status: '',
                	is_finished: '',
                },
				is_shipment: false,
				is_disburden: true,
				is_access: false,
				empty_type: 0,
				shipmentList: [],
				disburdenList: [],
				accessList: [],
				printForm: {},
				checkList: [],
				checkList2: [],
				checkListArr: [],
				printFormVisible: false,
				printLoading: false,
				detailsVisible: false,
				details: {},
				zoom_img: '',
				is_zoom_img: false,
				is_print: '',
			}
		},
        computed: {

            ...mapState(
                {
                  'my_permi': state => state.my_permi,
                  'clientHeight': state => state.clientHeight
                }
            )
        },
		methods: {
			router(path) {
				this.$router.push(path)
			},
			changeval(type, val) {
				if(type == 'is_go'){
					this.screenForm.is_go = (this.screenForm.is_go == val) ? "" : val;
				}else if(type == 'is_success'){
					this.screenForm.is_success = (this.screenForm.is_success == val) ? "" : val;
				}else if(type == 'is_return'){
					this.screenForm.is_return = (this.screenForm.is_return == val) ? "" : val;
				}else if(type == 'is_void'){
					this.screenForm.is_void = (this.screenForm.is_void == val) ? "" : val;
				}
			},
			handleCurrentChange(val) {
				this.page = val;
				this.vehicle_list(this.screenForm);
			},
			shipmentHander() {
				this.is_shipment = true;
				this.empty_type = '1';
				this.vehicle_list(this.screenForm);
			},
			disburdenHander() {
				this.is_disburden = true;
				this.empty_type = '0';
				this.vehicle_list(this.screenForm);
			},
			accessHander() {
				this.is_access = true;
				this.empty_type = '2';
				this.vehicle_list(this.screenForm);
			},
            confirmdate() {
                this.vehicle_list(this.screenForm)
            },
			// 查看初称详情
			viewDetails(index) {
				this.detailsVisible = true
				this.details = this.accessList[index]
			},
			// 查看图片
			isZoom(imgSrc) {
				this.zoom_img = imgSrc
				this.is_zoom_img = !this.is_zoom_img
			},
			// 打印图片
            printBtn(path) {
				sessionStorage.setItem('printing', path);
    			let routeData = this.$router.resolve({path: '/print', query:{img : 'img'}});
    			window.open(routeData.href, '_blank');
            },
			//获取内部车辆信息
			vehicle_list(para) {
                let paras = `page=${this.page}`;
                if(this.screenDate){
					let begin = new Date(this.screenDate[0]);
					let end = new Date(this.screenDate[1]);
					paras += `&start_time=${begin.getFullYear() + '-' + (begin.getMonth()+1) + '-' + begin.getDate()}`;
					paras += `&end_time=${end.getFullYear() + '-' + (end.getMonth()+1) + '-' + end.getDate() + ' 23:59:59'}`;
                }
                if(para && this.empty_type=='2'){
                	if(para.io_status){
                      paras += `&io_status=${para.io_status}`
                    }
                    if(para.is_finished){
                      paras += `&is_finished=${para.is_finished}`
                    }
                }else if(para){
                    if(para.is_void){
                      paras += `&is_void=${para.is_void}`
                    }
                    if(para.is_return){
                      paras += `&is_return=${para.is_return}`
                    }
                    if(para.is_go){
                      paras += `&is_go=${para.is_go}`
                    }
                    if(para.is_success){
                      paras += `&is_success=${para.is_success}`
                    }
                }
				this.listLoading = true;
				summary(paras, this.empty_type).then((res) => {
					this.shipmentList = [];
					this.disburdenList = [];
					this.accessList = [];
					if(res.data.status.errCode == '10002'){
						sessionStorage.removeItem('token');
						this.$message({
							message: res.data.status.message,
							type: 'warning'
				        });
				        setTimeout(() =>{
				        	this.router({path: '/login'})
				        }, 1500);
						return;
					}
					this.total = res.data.data.total
					if(this.empty_type == '0'){
						this.shipmentList = res.data.data.data
					}else if(this.empty_type == '1'){
						this.disburdenList = res.data.data.data
					}else if(this.empty_type == '2'){
						this.accessList = res.data.data.data
					}
					this.listLoading = false
				});
			},
            //显示查询界面
            screenEdit: function () {
                this.screenFormVisible = true;
                this.screenForm = this.screenForm
            },
            //查询
            screenSubmit: function () {
                this.$refs.screenForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认提交吗？', '提示', {}).then(() => {
                            this.screenLoading = true;
                            let para = Object.assign({}, this.screenForm);
                            this.screenFormVisible = false;
							this.vehicle_list(para);
                            this.screenLoading = false;
                        });
                    }
                });
            },
			exportT(type) {
				let url = '';
				if(type == 'churu'){
					url = '/Summary/entry_exit_record/export';
				}else{
					url = '/Summary/Export';
				}
				let para = this.screenForm;
				let paras = `&empty_type=${this.empty_type}`;
                if(this.screenDate){
					let begin = new Date(this.screenDate[0]);
					let end = new Date(this.screenDate[1]);
					paras += `&start_time=${begin.getFullYear() + '-' + (begin.getMonth()+1) + '-' + begin.getDate()}`;
					paras += `&end_time=${end.getFullYear() + '-' + (end.getMonth()+1) + '-' + end.getDate()} + ' 23:59:59'`;
                }
                if(para){
                    if(para.is_void){
                      paras += `&is_void=${para.is_void}`
                    }
                    if(para.is_return){
                      paras += `&is_return=${para.is_return}`
                    }
                    if(para.is_go){
                      paras += `&is_go=${para.is_go}`
                    }
                    if(para.is_success){
                      paras += `&is_success=${para.is_success}`
                    }
                }
				location.href=`${BASEURL}${url}?token=${sessionStorage.token}${paras}&pageSize=${sessionStorage.getItem('pagesize')}`;
			},
            // 打印界面
            showPrint: function (type, index, row) {
                this.printFormVisible = true;
                this.checkListArr = [];
                this.checkList = [];
                this.checkList2 = [];
				this.is_print = '';
            	if(type){
            		this.checkListArr = ['车牌号,vehicle_number', '皮重,tare', '是否空车过磅,is_void_desc', '空车过磅重量,empty_weight', '地磅净重,net_weight', '异常备案,exception'];
	                if(type == 'zhuanghuo'){
            			this.is_print = 'zhuanghuo';
	                	this.checkListArr.push('过磅类型,empty_type_desc');
	                	this.checkListArr.push('提货重量,pick_weight');
	                	this.checkListArr.push('误差重量,weight_error');
	                	this.checkListArr.push('误差比例,weight_error_ratio');
	                	this.checkListArr.push('出厂过磅是否成功,is_success_desc');
	                	this.checkListArr.push('是否完成,is_finished_desc');
	                	this.checkListArr.push('是否允许出门,is_go_desc');
	                }else if(type == 'xiehuo'){
            			this.is_print = 'xiehuo';
	                	this.checkListArr.push('刷卡时间,first_readic_datetime');
	                	this.checkListArr.push('地磅总重,first_weight');
	                	this.checkListArr.push('卸货重量,discharge_weight');
	                	this.checkListArr.push('空车过磅时间,empty_weight_time');
	                	this.checkListArr.push('误差重量（地磅）,weight_error');
	                }
	                this.getPrintConfig();
            		return
            	}
            	this.checkListArr = [`车牌号: ${row.vehicle_number}`, `皮重: ${row.tare}`, `是否空车过磅: ${row.is_void_desc}`, `空车过磅重量: ${row.empty_weight}`, `地磅净重: ${row.net_weight}`, `异常备案: ${row.exception}`];
                if(this.is_shipment && (this.empty_type == '1')){
                	this.checkListArr.push(`刷卡时间: ${row.first_readic_datetime}`);
                	this.checkListArr.push(`地磅总重: ${row.first_weight}`);
                	this.checkListArr.push(`卸货重量: ${row.discharge_weight}`);
                	this.checkListArr.push(`空车过磅时间: ${row.empty_weight_time}`);
                	this.checkListArr.push(`误差重量（地磅）: ${row.weight_error}`);
                }else if(this.is_disburden && (this.empty_type == '0')){
                	this.checkListArr.push(`过磅类型： ${row.empty_type_desc}`);
                	this.checkListArr.push(`提货重量： ${row.pick_weight}`);
                	this.checkListArr.push(`误差重量： ${row.weight_error}`);
                	this.checkListArr.push(`误差比例： ${row.weight_error_ratio}`);
                	this.checkListArr.push(`出厂过磅是否成功： ${row.is_success_desc}`);
                	this.checkListArr.push(`是否完成： ${row.is_finished_desc}`);
                	this.checkListArr.push(`是否允许出门： ${row.is_go_desc}`);
                }
				this.getPrintConfig();
            },
            getPrintConfig() {
				printConfig().then((res) =>{
                	let dataList = res.data.data;
                	for(var i=0; i<this.checkListArr.length; i++){
                		for(var j=0; j<dataList.length; j++){
                			if(this.checkListArr[i].indexOf(dataList[j].name) > -1 && dataList[j].type == '1'){
                				if(this.checkList.indexOf(this.checkListArr[i]) < 0){
                					this.checkList.push(this.checkListArr[i])
                				}
                			}else if(this.checkListArr[i].indexOf(dataList[j].name) > -1 && dataList[j].type == '2'){
                				this.checkList2.push(this.checkListArr[i])
                			}
                		}
                	}
                })
            },
            printSubmit () {
	            this.printFormVisible = false;
	            this.printLoading = false;
	            if(this.is_print){
	            	let dataJson = {}
	            	if(this.is_print == 'xiehuo'){
	            		var otherArr = [];
	            		for(var i=0; i<this.checkList.length; i++){
	            			var newArr = this.checkList[i].split(',');
	            			for(var j=0; j<newArr.length; j++){
	            				var otherArr2 = {
									"identity": newArr[1],
									"name": newArr[0],
									"value":"1"
								}
	            			}
	            			otherArr.push(otherArr2);
	            		}
						dataJson={
							// 1为卸货
							"type":"1",
							"othor": otherArr
						}
	            	}else{
	            		var otherArr = [];
	            		for(var i=0; i<this.checkList2.length; i++){
	            			var newArr = this.checkList2[i].split(',');
	            			for(var j=0; j<newArr.length; j++){
	            				var otherArr2 = {
									"identity": newArr[1],
									"name": newArr[0],
									"value":"1"
								}
	            			}
	            			otherArr.push(otherArr2);
	            		}
						dataJson={
							// 2为装货
							"type":"2",
							"othor": otherArr
						}
	            	}
	            	printConfigPost(dataJson).then((res) => {
	            		console.log(res)
	            	}).catch((err) => {
	            		console.dir(err)
	            	})
	            }else{
	            	if(this.is_shipment && (this.empty_type == '1')){
			            var str = this.checkList.join('*');
			            sessionStorage.setItem('printing', str);
	            	}else{
	            		var str = this.checkList2.join('*');
			            sessionStorage.setItem('printing', str);
	            	}
	            	let routeData = this.$router.resolve({path: '/print'});
					window.open(routeData.href, '_blank');
	            }
            },
			// 已完成是背景色变色
			tableRowClassName(row) {
				if(row.is_finished == 'Y'){
					return 'is_finished_tr';
				}
			}
		},
		mounted() {
			this.vehicle_list();
		}
	};

</script>


<style>
.monthly .el-table th>.cell,.monthly .el-table td>.cell{
    white-space: normal !important;
    text-align: center;
}
.monthly thead th.is-leaf{
    border-right: 1px solid #dfe6ec;
    border-top: 1px solid #dfe6ec;
}
.monthly thead th{
    border-right: 1px solid #dfe6ec;
    border-top: 1px solid #dfe6ec;
}

.el-checkbox{
	margin-right: 15px!important;
	margin-left: 0!important;
	margin-bottom: 10px;
	display: block;
}
.el-table .is_finished_tr{
	background-color: #f7f7f7;
}
</style>